/*
 * 实时公交顶端提醒组件
 *
 * @Author: zhangtao.zhou
 * @Date: 2018-06-26 10:00:27
 * @Last Modified by: yingying.fan
 * @Last Modified time: 2019-05-28 17:33:48
 */
<template>
  <div
    class="flex-h flex-hsb flex-vc notice-wrapper"
    @click="pushToNotice"
  >
    <div class="flex-h flex-hc flex-vc">
      <i class="iconfont icon-inform baseColorNoAcitve"></i>
    </div>
    <p class="flex1 fontsize28">{{notice.title}}</p>
    <i class="iconfont icon-rightangel"></i>
  </div>
</template>
<script>
import NoticeModel from '../model/NoticeModel'
const LINE_CACHE_KEY = 'LineNoticeModule28DALDNA'
export default {
  props: {
    notice: {
      type: NoticeModel,
      default: () => {
        return null
      }
    }
  },
  methods: {
    pushToNotice() {
      if (this.notice.goToUrl) {
        this.$RouteTableUtils.open(this.notice.goToUrl)
      } else {
        let cacheValue = JSON.stringify({
          NOTICE_ID: this.notice.id,
          NOTICE_TITLE: this.notice.title,
          NOTICE_CONTENT: this.notice.content,
          NOTICE_TIME: this.notice.time,
          SEGMENT_NAME_LIST: this.notice.segmentNameList,
          GOTO: this.notice.goToUrl
        })
        window.localStorage.setItem(LINE_CACHE_KEY, cacheValue)
        this.$RouteTableUtils.goToNoticeDetail()
      }
    }
  }
}
</script>

<style scoped>
.notice-wrapper {
  width: 690px;
  height: 100px;
  padding: 0 30px;
  /* background: #ffffff; */
}
.notice-wrapper > div {
  width: 70px;
  height: 70px;
  background: #f2f5f6;
  border-radius: 8px;
  margin-right: 30px;
}
.notice-wrapper .icon-inform {
  font-size: 56px;
}
.notice-wrapper .icon-rightangel {
  color: #d8d8d8;
  margin: 0 0 0 30px;
  font-size: 38px;
  color: #d8d8d8;
}
</style>
